<template>
    <div id="box">
        <div class="bar">
            <button></button>
            <input type="text" placeholder="演出日历">
        </div>
        <span @click="back">取消</span>
    </div> 
</template>

<script>
export default {
       name:"SearchBar",
       methods:{
           back(){
               this.$router.go(-1)
           }
       }
}
</script>

<style scoped>
#box{
    font-size:0.11rem;
    height: 0.44rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
#box .bar{
    width: 2.84rem;
    height: 0.3rem;
    border: 0.01rem solid #f3edeb;
    background: -webkit-linear-gradient(left, #feefea , #f2f0fd);
    display: flex;
    border-radius: 0.14rem 0.12rem 0.12rem 0.02rem
}
.bar button{
    width: 15%;
    height: 100%;
    background: none;
    border: none;
    outline:none;
    background: url(../../assets/images/fangdajing.png) no-repeat 0.12rem 0.07rem;
    background-size: 0.14rem 0.15rem
}
.bar input{
    width: 80%;
    height: 100%;
    background: none;
    border: none;
    outline:none
}
#box span{
    font-size: 0.15rem;
    margin-left: 0.15rem;
}
</style>
